<template>
  <div class="execution">
    <basic-container>
      <avue-crud
        v-model="form"
        v-bind="bindVal"
        v-on="onEvent"
        :page.sync="page"
        :permission="permissionList">
        <template slot-scope="scope" slot="menuLeft">
          <el-button type="primary"
                     size="small"
                     v-permission="permissionList.addBtn"
                     @click.stop="genReport()">盘 点
          </el-button>	 
         <el-button type="primary"
                    size="small"
                    v-permission="permissionList.export"
                    @click.stop="handleExport()">导 出
         </el-button>
         <el-button type="primary"
                    size="small"
                    :hidden="true"
                    v-if="false"
                    @click.stop="handlePrint()">打 印
         </el-button>
        </template>
        <template slot-scope="{row, index}" slot="menu">
          <el-button type="text" size="small"
            v-permission="permissionList.editBtn"
            @click="rowEdit(row, index)">编 辑</el-button>
	   <el-button type="text" size="small"
            v-permission="permissionList.delBtn"
            @click="rowDel(row, index)">删 除</el-button>
          <el-button type="text" size="small" @click="rowView(row, index)">预 览</el-button>
        </template>
      </avue-crud>
      <open-dialog :title="title" :DialogVisible.sync="dialogVisible">
        <avue-form v-model="form" :option="editFormOption" v-if="dialogVisible"></avue-form>
        <!-- <dynamic-crud title="盘点明细" :data="form.listDetails" :option="detailTableOption" :button="false"></dynamic-crud> -->
        <Details title="盘点明细" ref="detailsCrud" :mainId="mainId" :signId="signId" v-if="dialogVisible" v-on:spot="spot"></Details>
        <template v-if="boxType=='edit'" slot="footer">
          <el-button type="primary" size="small" @click="submitEdit">确 认</el-button>
          <el-button size="small" @click="dialogVisible=false">取 消</el-button>
        </template>
      </open-dialog>
      <open-dialog :title="title" :DialogVisible.sync="dialogVisibleView">
        <avue-form v-model="form" :option="editFormOption" v-if="dialogVisibleView"></avue-form>
        <Details title="盘点明细" :mainId="mainId" v-if="dialogVisibleView"></Details>
        <template slot="footer" v-if="dialogVisibleView">
          <el-button size="small" @click="dialogVisibleView=false">取 消</el-button>
        </template>
      </open-dialog>
    </basic-container>
  </div>
</template>

<script>
import baseCrud from '@/mixins/base-crud'
import {addObj, getObj,delObj} from '@/api/subway/swststockmonthcheck'
import {editFormOption, detailTableOption,nowDate} from '@/const/crud/subway/swststockmonthcheck'
import Details from "./Details"

export default {
  name: 'SwStStockMonthDetail',
  mixins: [baseCrud('subway/swststockmonthcheck')],
  components: {
    Details,
  },
  data() {
    return {
      exportName: '车票周期盘点.xlsx',
      title: '',
      dialogVisible: false,
      dialogVisibleView: false,
      editFormOption: editFormOption,
      detailTableOption: detailTableOption,
      boxType: '',
      form: {
        listDetails: []
      },
      searchForm: {
        dateYearMonth: nowDate
      },
      mainId: null,
      signId: 0
    }
  },
  computed: {
    permissionList() {
      return {
        addBtn: this.vaildData(this.permissions.st_sw_tk_stock_month_check_add, false),
        editBtn: this.vaildData(this.permissions.st_sw_tk_stock_month_check_edit, false),
	delBtn: this.vaildData(this.permissions.st_sw_tk_stock_month_check_del, false),
        exportBtn: this.vaildData(this.permissions.st_sw_tk_stock_month_check_export, false)
      }
    }
  },
  // watch: {
  //   'form.listDetails': {
  //     handler(newValue, oldValue) {
  //       let checkNumber = 0
  //       let differenceNumber = 0
  //       newValue.forEach(value => {
  //         value.differenceNumber = value.settleNumber - (value.checkNumber || 0)
  //         checkNumber += value.checkNumber||0
  //         differenceNumber += value.differenceNumber||0
  //       })
  //       this.form.checkNumber = checkNumber
  //       this.form.differenceNumber = differenceNumber
  //     },
  //     deep: true
  //   }
  // },
  methods: {
    spot:function(data){
      // this.form.checkNumber = data.checkNumber;
      // this.form.differenceNumber = data.differenceNumber;
    },
    genReport() {//生成周期报告
      this.$confirm('是否生成周期盘点？')
          .then(_ => {
            addObj().then(() => {
            this.$message.success('盘点成功')
            this.getList(this.page)
            })
          })
          .catch(_ => {});
    },
    rowEdit(row, index){
      this.mainId = row.id;
      this.signId = 1;
      this.title = '编 辑'
      this.boxType = 'edit'
      this.editFormOption.disabled = false
      getObj(row.id).then(response => {
        this.form = response.data.data;
        // this.form.listDetails.forEach(d => {
        //   d.$cellEdit = true
        //   //d.stockArea = Number(d.stockArea)
        // })
        this.dialogVisible = true;
      })
    },
    rowDel(row, index){     
       this.$confirm('是否删除周期盘点数据？')
          .then(_ => {
            delObj(row).then(() => {
            this.$message.success('删除成功')
            this.getList(this.page)
            })
          })
          .catch(_ => {});
      
    },
    submitEdit(){
      let done = () => {
        this.dialogVisible = false
      }
      //表格当前页所有数据
      const selectKeys = this.$refs.detailsCrud.$refs.crud.data;
      //表格所选择数据
      //const selectKeys = this.$refs.detailsCrud.$refs.crud.tableSelect;
      this.form.listDetails = selectKeys;
      this.rowUpdate(this.form, null, done, ()=>{})
    },    
    rowView(row, index){
      this.mainId = row.id;
      this.title = '预 览'
      this.boxType = 'view'
      this.editFormOption.disabled = true
      getObj(row.id).then(response => {
        this.form = response.data.data
        this.dialogVisibleView = true
      })
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
